<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>clothing</title>
    <link rel="stylesheet" href="../css/reset.css"/>
    <link rel="stylesheet" href="../css/common.css"/>
    <link rel="stylesheet" href="../css/swiper.css"/>
    <script src="../js/angular-1.4.6.min.js"></script>
    <script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
    <script src="../js/swiper.jquery.min.js"></script>
    <script src="../js/jquery.imagezoom.min.js"></script>
    <style>

        .content{margin-top: 40px;}
        .right-detail{}
        .right-detail .goods-name{font-size: 20px;}
        .right-detail .price{margin-top: 30px;font-size: 18px;}
        .right-detail .price span{font-size: 24px;display: inline-block;margin-left: 10px;}
        .right-detail .write-review{font-size: 16px;color: #726b66;vertical-align: middle;margin-top: 10px;cursor: pointer;}
        .right-detail .write-review img{margin-right: 10px;}
        .right-detail .size{line-height: 38px;font-size: 16px;margin: 30px 0;}
        .right-detail .size span{float: left;color: #726b66;display: inline-block;width: 50px;line-height: 40px;}
        .right-detail .size p{float: left;width: 38px;height: 38px;border: 1px solid #c7c7c7;
            text-align: center;text-transform: uppercase;margin-right: 6px;cursor: pointer;}
        .right-detail .size .size-select{color: #c4261d;border: 1px solid #c4261d;}
        .right-detail .size .size-hover:hover{border: 1px solid #000;}
        .right-detail .qty{overflow: hidden;font-size: 16px;margin-bottom: 15px;}
        .right-detail .qty span{float: left;color: #726b66;display: inline-block;width: 50px;line-height: 40px;font-size: 14px;}
        .right-detail .qty input{float: left;display: block;border: 1px solid #c7c7c7;width: 95px;height: 38px;text-align: center;}
        .right-detail .qty div{float: left;}
        .right-detail .qty div p{width: 24px;height: 16px;line-height: 16px;border-top: 1px solid #c7c7c7;
            border-right: 1px solid #c7c7c7;border-bottom: 1px solid #c7c7c7;text-align: center;font-size: 20px;cursor: pointer;}
        .right-detail .qty div .less{margin-top: 4px;}
        .right-detail .qty div p:active{background-color: #ebebeb;}
        .right-detail .adv-con{position: relative;}
        .right-detail .adv-con>.fl{margin-left: 25px;}
        .right-detail .adv-con>.fl .arr{width: 25px;height: 25px;border: 1px solid #c7c7c7;color: #666;text-align: center;
            line-height: 25px;font-size: 20px;cursor: pointer;}
        .right-detail .adv-con>.fl:hover .adv-s{display: block;}
        .right-detail .adv-con>.fl .adv-s{display: none;position: absolute;background-color: #f8f8f8;padding: 5px;width: 160px;right: 0;top: 27px;}
        .right-detail .adv-con>.fl .adv-s .adv-s-l{float: left;}
        .right-detail .adv-con>.fl .adv-s .adv-s-l img{width: 55px;display: block;}
        .right-detail .adv-con>.fl .adv-s .adv-s-r{width: 95px;float: left;margin-left: 10px;}
        .right-detail .adv-con>.fl .adv-s .adv-s-name{line-height: 30px;}
        .right-detail .adv-con>.fl .adv-s .adv-s-price{line-height: 30px;}
        .right-detail .r-t-check{}
        .right-detail .r-t-check p{line-height: 30px;}
        .right-detail .r-t-check p input{vertical-align: middle;margin-right: 10px;}
        .right-detail .r-t-check div{display: none;padding: 5px 0;}
        .right-detail .r-t-check div input{width: 167px;display: inline-block;height: 28px;text-align: center;border: 1px solid #c7c7c7;}
        .right-detail .add-cart{width: 150px;height: 35px;margin-top: 20px;cursor: pointer;line-height: 35px;color: #fff;text-align: center;font-size: 12px;font-weight: bold;}
        .right-detail .add-cart img{vertical-align: middle;margin-right: 10px;}
        .right-detail .tab-card{margin-top: 30px;}
        .right-detail .tab-card .tab-head{}
        .right-detail .tab-card .tab-head ul{overflow: hidden;background-color: #f8f8f8;border-right: 1px solid #c7c7c7;}
        .right-detail .tab-card .tab-head ul li{float: left;height: 40px;line-height: 40px;font-size: 14px;text-align: center;
            border-left: 1px solid #c7c7c7;border-top: 1px solid #c7c7c7;border-bottom: 1px solid #c7c7c7;cursor: pointer;}
        .right-detail .tab-card .tab-head ul .tab-item{width: 135px;}
        .right-detail .tab-card .tab-head ul .tab-active{background-color: #fff;border-bottom: 1px solid #fff;border-top: 1px solid #191919;cursor: default;}
        .right-detail .tab-card .tab-head ul .tab-last{width: 54px;}
        .right-detail .tab-card .tab-con{padding: 30px;border-left: 1px solid #c7c7c7;border-right: 1px solid #c7c7c7;border-bottom: 1px solid #c7c7c7;}
        .right-detail .tab-card .tab-con .tab-con-box{display: none;}
        .right-detail .tab-card .tab-con .tab-con1{}
        .right-detail .tab-card .tab-con .tab-con-active{display: block;}
        .right-detail .tab-card .tab-con .tab-con1 span{display: block;font-weight: bold;font-size: 14px;padding-top: 10px;}
        .right-detail .tab-card .tab-con .tab-con1 p{font-size: 14px;color: #666;margin-top: 20px;text-align: justify;}
        .right-detail .tab-card .tab-con .tab-con2 .tc2-title{font-size: 14px;line-height: 30px;border-bottom: 1px solid #c7c7c7;color: #666;}
        .right-detail .tab-card .tab-con .tab-con2 .tc2-tip{padding: 20px 0 10px;}
        .right-detail .tab-card .tab-con .tab-con2 .tc2-tip span{margin-left: 5px;}
        .right-detail .tab-card .tab-con .tab-con2 .rating{margin-bottom: 20px;}
        .right-detail .tab-card .tab-con .tab-con2 .star-i{float: left;margin-right: 8px;width: 20px;cursor: pointer;height: 18px;
            background-image: url("../img/vimostsports（Customer-Reviews-）-1_13.jpg");  background-position: 0 0;background-size: 20px auto;}
        .right-detail .tab-card .tab-con .tab-con2 .review textarea{display: block;width: 100%;height: 160px;border: 1px solid #c7c7c7;resize: none;}
        .right-detail .tab-card .tab-con .tab-con2 .tc2-inp input{display: block;width: 100%;height: 36px;border: 1px solid #c7c7c7;}
        .right-detail .tab-card .tab-con .tab-con2 .tc2-submit{width: 80px;height: 40px;background-color: #f8f8f8;line-height: 40px;margin-top: 20px;cursor: pointer;}
        .right-detail .tab-card .tab-con .tab-con3{}
        .right-detail .tab-card .tab-con .tab-con3 .t3-img{width: 165px;}
        .right-detail .tab-card .tab-con .tab-con3 .t3-img img{display: block;width: 100%;border: 1px solid #c7c7c7;}
        .right-detail .tab-card .tab-con .tab-con3 .t3-table{width: 350px;}
        .right-detail .tab-card .tab-con .tab-con3 .t3-table table{width: 100%;text-align: center;}
        .right-detail .tab-card .tab-con .tab-con3 .t3-table table th{background-color: #acaaab;width: 25%;border: 1px solid #fff;height: 22px;}
        .right-detail .tab-card .tab-con .tab-con3 .t3-table table td{background-color: #f8f8f8;border: 1px solid #fff;height: 22px;}

        .right-detail .tab-card .tab-con .tab-con4{min-height: 200px;}
        .right-detail .tab-card .tab-con .tab-con4 p{text-align: justify;font-size: 14px;color: #888;}

        .big-review{}
        .big-review .review-head{position:relative;z-index:1;display: table;width: 500px;height: 500px;margin: 0 auto;}
        .big-review .review-head a{text-align: center;display: table-cell;vertical-align: middle;}
        .big-review .review-head a img{max-width: 500px;max-height: 500px;}
        .big-review ul{overflow: hidden;margin-top: 15px;width: 600px;}
        .big-review ul li{width: 170px;height: 170px;display: table;border: 1px solid #c7c7c7;margin-right: 10px;margin-bottom: 10px;;float: left;}
        .big-review ul li a{display: table-cell;vertical-align: middle;text-align: center;}
        .big-review ul li a img{max-width: 170px;max-height: 170px;display: block;margin: 0 auto;}
        .big-review ul .review-active{border: 1px solid red;}
        .zoomDiv{z-index:999;position:absolute;top:0;left:0;width:500px;height:500px;background:#ffffff;display:none;text-align:center;overflow:hidden;}
        .zoomDiv img{display: block;}
        .zoomMask{position:absolute;background:url("../img/mask.png") repeat scroll 0 0 transparent;cursor:move;z-index:1;}


        .bot-con{margin-top: 40px;}
        .horizontal-slide{}
        .hor-title{border-bottom: 1px solid #c7c7c7;position: relative;padding-bottom: 10px;margin-top: 30px;}
        .hor-title div{width: 25px;height: 25px;border: 1px solid #c7c7c7;color: #666;text-align: center;
            line-height: 25px;font-size: 20px;cursor: pointer;}
        .hor-title p{position: absolute;line-height: 25px;text-align: center;left: 30px;right: 30px;top: 6px;;letter-spacing: 1px;}

        .swiper-container{width: 100%;margin-top: 30px;}
        .swiper-slide{text-align: center;}
        .swiper-slide .img-box{display: table;width: 100%;height: 330px;}
        .swiper-slide .img-box a{display: table-cell;vertical-align: middle;text-align: center;height: 330px;}
        .swiper-slide .img-box a img{max-width: 240px;max-height: 330px;}
        .swiper-slide .img-name{margin-top: 30px;text-transform: uppercase;font-weight: bold;}
        .swiper-slide .img-price{margin-top: 5px;}
    </style>
</head>
<body ng-app="">
<!--公共头部-->
<div ng-include="'../html/header.html'"></div>
<div class="bread container-fluid">
    <div class="container clear">
        <div class="fl path">
            <p class="fs-18"><em>You are here:&nbsp;</em><a href="" class="text-capitalize">Home</a>&nbsp;>&nbsp;<span class="bold red text-capitalize">clothing</span></p>
        </div>
        <div class="fr">
            <div class="btn b-red white fs-14 bold">JUMP TO<img src="../img/vimostsports（About-Us-）_03.jpg" alt=""/></div>
            <ul class="list fs-14 text-capitalize">
                <li>
                    <a href="">about us</a>
                </li>
                <li>
                    <a href="">gallery</a>
                </li>
                <li>
                    <a href="">sublimation</a>
                </li>
                <li>
                    <a href="">how to order</a>
                </li>
                <li>
                    <a href="">order process</a>
                </li>
                <li>
                    <a href="">fabric guide</a>
                </li>
                <li>
                    <a href="">blog</a>
                </li>
                <li>
                    <a href="">FAQS</a>
                </li>
                <li>
                    <a href="">customer reviews</a>
                </li>
                <li>
                    <a href="">contact us</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="content container">
    <div class="top-con clear">
        <div class="big-review col-6">
            <div class="review-head">
                <a href="javascript:void(0);">
                    <img src="../img/test_mid.jpg" rel="../img/test1.jpg" class="jqzoom"/>
                </a>
            </div>
            <ul>
                <li class="review-active">
                    <a href="">
                        <img src="../img/test_mid.jpg" alt="" rel="../img/test1.jpg"/>
                    </a>
                </li>
                <li>
                    <a href="">
                        <img src="../img/test2_mid.jpg" alt="" rel="../img/test2.jpg"/>
                    </a>
                </li>
                <li>
                    <a href="">
                        <img src="../img/test3_mid.jpg" alt="" rel="../img/test3.jpg"/>
                    </a>
                </li>
                <li>
                    <a href="">
                        <img src="../img/test5_mid.jpg" alt="" rel="../img/test5.jpg"/>
                    </a>
                </li>
            </ul>
        </div>
        <div class="right-detail col-6">
            <div class="r-t-detail clear">
                <div class="fl">
                    <b class="goods-name text-uppercase">paisley hoodil</b>
                    <p class="price red bold" data-price="4.85">Price<span class="red">$4.85</span></p>
                    <p class="write-review fs-14"><img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_13.png" alt=""/>write a review</p>
                    <div class="size clear">
                        <span>size</span>
                        <p class="size-hover">xs</p>
                        <p class="size-hover">s</p>
                        <p class="size-hover">l</p>
                        <p class="size-hover">2xl</p>
                    </div>
                    <div class="qty">
                        <span>QTY</span>
                        <input class="count" type="text" maxlength="2" value="1"/>
                        <div>
                            <p class="add">+</p>
                            <p class="less">-</p>
                        </div>
                    </div>
                </div>
                <div class="adv-con fr clear">
                    <div class="adv-l fl">
                        <div class="arr">&lt;</div>
                        <div class="adv-s clear">
                            <div class="adv-s-l">
                                <img src="../img/vimostsports（Accessories）导航悬停样式_03.jpg" alt=""/>
                            </div>
                            <div class="adv-s-r">
                                <p class="adv-s-name fs-12">paisley hoodil</p>
                                <p class="adv-s-price bold fs-12 red">price <span class="red">$4.85</span></p>
                            </div>
                        </div>
                    </div>
                    <div class="adv-r fl">
                        <div class="arr">&gt;</div>
                        <div class="adv-s clear">
                            <div class="adv-s-l">
                                <img src="../img/vimostsports（Accessories）导航悬停样式_03.jpg" alt=""/>
                            </div>
                            <div class="adv-s-r">
                                <p class="adv-s-name fs-12">paisley hoodil</p>
                                <p class="adv-s-price bold fs-12 red">price <span class="red">$4.85</span></p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="r-t-check fs-14">
                <p><input type="checkbox"/>Would you like custom name on this product?(+$2/each)</p>
                <div>
                    <input type="text" placeholder="Custom Name"/>
                </div>
            </div>
            <div class="r-t-check fs-14">
                <p><input type="checkbox"/>Would you like custom number on this product?(+$2/each)</p>
                <div>
                    <input type="text" placeholder="Custom Number"/>
                </div>
            </div>
            <div class="add-cart b-red"><img src="../img/vimostsports（Product-details-page）-chanpingxiangqing-gouwuche.png"/>ADD TO CART</div>
            <div class="tab-card">
                <div class="tab-head">
                    <ul>
                        <li class="tab-item tab-active">DESCRIPTION</li>
                        <li class="tab-item">REVIEW(0)</li>
                        <li class="tab-item">THE SIZE CHART</li>
                        <li class="tab-item">CUSTOM SERVICE</li>
                        <li class="tab-last"></li>
                    </ul>
                </div>
                <div class="tab-con">
                    <div class="tab-con-box tab-con1 tab-con-active">
                        <span>You are here:&nbsp;You are here:&nbsp;</span>
                        <p>You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;</p>
                    </div>
                    <div class="tab-con-box tab-con2">
                        <p class="tc2-title">There are no review yet</p>
                        <p class="tc2-tip text-capitalize bold fs-14">your rating</p>
                        <div class="rating clear" data-score="0">
                            <div class="star-i"></div><div class="star-i"></div><div class="star-i"></div><div class="star-i"></div><div class="star-i"></div>
                        </div>
                        <p class="tc2-tip text-capitalize bold fs-14">your review</p>
                        <div class="review"><textarea></textarea></div>
                        <p class="tc2-tip text-capitalize bold fs-14">name<span class="red">*</span></p>
                        <div class="tc2-inp"><input type="text"/></div>
                        <p class="tc2-tip text-capitalize bold fs-14">email<span class="red">*</span></p>
                        <div class="tc2-inp"><input type="text"/></div>
                        <div class="tc2-submit text-center bold">SUBMIT</div>
                    </div>
                    <div class="tab-con-box tab-con3 clear">
                        <div class="fl t3-img"><img src="../img/QQ截图20160629135715.png" alt=""/></div>
                        <div class="fr t3-table">
                            <p class="">
                                <span class="fl text-uppercase bold">hoodie</span>
                                <span class="fr text-uppercase bold">units:inches</span>
                            </p>
                            <table cellpadding="0" cellspacing="0">
                                <tr>
                                    <th>size</th>
                                    <th>length(a)</th>
                                    <th>bust(b)</th>
                                    <th>sleeve(c)</th>
                                </tr>
                                <tr>
                                    <td>SX</td>
                                    <td>26</td>
                                    <td>21.6</td>
                                    <td>29.6</td>
                                </tr>
                                <tr>
                                    <td>S</td>
                                    <td>26.8</td>
                                    <td>22.4</td>
                                    <td>30.2</td>
                                </tr>
                                <tr>
                                    <td>M</td>
                                    <td>27.6</td>
                                    <td>23.2</td>
                                    <td>30.8</td>
                                </tr>
                                <tr>
                                    <td>L</td>
                                    <td>28.4</td>
                                    <td>24</td>
                                    <td>31.4</td>
                                </tr>
                                <tr>
                                    <td>XL</td>
                                    <td>29.2</td>
                                    <td>24.8</td>
                                    <td>32</td>
                                </tr>
                                <tr>
                                    <td>2XL</td>
                                    <td>30</td>
                                    <td>35.6</td>
                                    <td>32.6</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div class="tab-con-box tab-con4">
                        <p>You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;You are here:&nbsp;</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="bot-con">
        <div class="horizontal-slide">
            <div class="hor-title clear">
                <div class="hor-arr arr-l fl">&lt;</div>
                <p class="text-uppercase bold fs-16">accessories products</p>
                <div class="hor-arr arr-r fr">&gt;</div>
            </div>
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="horizontal-slide">
            <div class="hor-title clear">
                <div class="hor-arr arr-l fl">&lt;</div>
                <p class="text-uppercase bold fs-16">related products</p>
                <div class="hor-arr arr-r fr">&gt;</div>
            </div>
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                    <div class="swiper-slide">
                        <div class="img-box">
                            <a href="#">
                                <img src="../img/vimostsports（Product-details-page）-chanpingxiangqing_29.png" alt=""/>
                            </a>
                        </div>
                        <p class="img-name">paisley hoodil</p>
                        <p class="img-price red bold fs-12">From <span class="red">$4.85</span></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--公共底部-->
<div ng-include="'../html/footer.html'"></div>
</body>
<script>
    var nav = setTimeout(function(){
        $('.nav li').eq(2).find('.nav-item').addClass('b-red').attr('href','javascript:void(0);');
    },0);

    //计算价格
    var mycount = {
        price: 0,
        num:0,
        init:function(){
            this.price = parseFloat($('.price').attr('data-price'));
            this.num = parseInt($('.count').val());
            this.bind();
            this.total()
        },
        bind:function(){
            $('.qty .add').on('click',function(){
                mycount.plus();
            });
            $('.qty .less').on('click',function(){
                mycount.less();
            });
            $('.count').on('keyup',function(){
                mycount.keyDown()
            })
        },
        total:function(){
            var money = this.price*this.num;
            money = money.toFixed(2);
            $('.price span').html('$'+money)
        },
        plus:function(){
            this.num++;
            $('.count').val(this.num);
            this.total()
        },
        less:function(){
            if(this.num>1){
                this.num--;
                $('.count').val(this.num);
                this.total()
            }
        },
        keyDown:function(){
            var str = $('.count').val();
            var test = /^[0-9]\d*$/;
            if(test.test(str)){
                this.num = parseInt(str);
                this.total()
            }else{
                $('.count').val(1);
                this.total()
            }
        }
    };
    $(function(){
        //初始化计算价格
        mycount.init();
        //购买选项
        $('.r-t-check p input').on('click',function(){
            var c = $(this).is(':checked');
            if(c){
                $(this).parent().siblings().slideDown();
            }else{
                $(this).parent().siblings().slideUp();
            }
        });
        $('.size p').click(function(){
            $(this).removeClass('size-hover').addClass('size-select').siblings().removeClass('size-select').addClass('size-hover');
        });

        //评分
        $('.star-i').click(function(){
            var _index = $(this).index()+1;
            $(this).parent().attr('data-score',_index);
            $(this).css('background-positionY','18px').prevAll().css('background-positionY','18px');
            $(this).nextAll().css('background-positionY','');
        });
        //tab选项卡
        $('.tab-item').click(function(){
            var _index = $(this).index();
            $(this).addClass('tab-active').siblings().removeClass('tab-active');
            $('.tab-con-box').eq(_index).show().siblings().hide();
        });
        //图片放大镜
        $(".jqzoom").imagezoom();
        $(".big-review ul li").click(function() {
            $(this).addClass("review-active").siblings().removeClass("review-active");
            $(".jqzoom").attr('src', $(this).find("img").attr("src"));
            $(".jqzoom").attr('rel', $(this).find("img").attr("rel"));
        });

        //图片轮播
        $('.swiper-container').each(function(){
            var _this = $(this);
            var prev = $(this).siblings().find('.arr-l');
            var next = $(this).siblings().find('.arr-r');
            var mySwiper = new Swiper(_this,{
                slidesPerView : 5,
                spaceBetween : 20,
                // 如果需要前进后退按钮
                nextButton: next,
                prevButton: prev,
                loop: true
            });
        });
        //评论跳转
        $('.write-review').click(function(){
            $('.tab-item').eq(1).addClass('tab-active').siblings().removeClass('tab-active');
            $('.tab-con-box').eq(1).show().siblings().hide();
            var top = $('.tab-item').offset().top;
            $('body,html').animate({scrollTop:top});

        })
    })
</script>
<script src="../js/scroll_top.js"></script>
</html>